<template>
    <div class="state">
        <hr>
        <h2>name:{{ name }}</h2>
        <h2>age:{{ age }}</h2>
        <h2>level:{{ level }}</h2>
        <button @click="changeState">修改state</button>
        <button @click="resetState">重置state</button>
    </div>
</template>
<script setup>
import useUser from "@/stores/user"
import { storeToRefs } from "pinia";
const user = useUser()
const { name, age, level } = storeToRefs(user)

function changeState() {
    // 1.function函数修改
    // user.name = "花染"
    // user.age = 18,
    // user.level=200

    // 3.一次性修改
    // user.$patch({
    //     name: "嘉然",
    //     age: 17,
    //     level: 300
    // })
    // 4.替换对象
    const oldUser = user.$state
    user.$state = {
        name: "染染",
        // age: 10,
        level: 400
    }
    console.log(oldUser === user.$state);
}
// 2.重置state
function resetState() {
    user.$reset()
}
</script>
<style scoped lang="less"></style>
